<!--
 * @Author: ljc
 * @Date: 2023-04-27 16:44:09
 * @LastEditors: g05047
 * @LastEditTime: 2023-04-27 18:18:25
 * @Description: 上传
-->
<template>
  <el-drawer v-model="visible"
    class="rk-upload-drawer"
    size="100%"
    append-to-body
    :show-close="false"
    :with-header="false">
    <div class="rk-upload-drawer-container">
      <div class="upload-drawer-header"
        flex>
        <div class="upload-drawer-header-title">
          <span class="title-info">附件管理</span>
        </div>
        <div class="upload-drawer-header-tools"
          flex-col>
          <el-button type="danger"
            @click="handleClose">关闭</el-button>
        </div>
      </div>
      <div class="upload-drawer-body">
        <attachment-panel></attachment-panel>
      </div>
    </div>
  </el-drawer>
</template>
 <script setup>
import AttachmentPanel from '@/components/form-slots/components/AttachmentPanel.vue'
const emit = defineEmits(['save'])
const props = defineProps({
})
const visible = ref(false)
// ----- Drawer相关操作
function handleOpen(value) {
  visible.value = true
}
function handleClose() {
  handleReset()
}
function handleReset() {
  visible.value = false
}
// 对外暴露方法
defineExpose({
  handleOpen
})
  </script>
  
   <style lang="scss" scoped>
.rk-upload-drawer-container {
  height: 100%;
  background-color: #f0f2f5;
}

.upload-drawer-header {
  width: 100%;
  height: 52px;
  line-height: 52px;
  border-bottom: 1px solid #e8e8e8;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .upload-drawer-header-title {
    width: 300px;
    padding-left: 20px;
    .title-info {
      font-size: 16px;
    }
  }
  .upload-drawer-header-steps {
    flex: 1;
    line-height: 1;
    padding: 15px 120px 15px 30px;
    .el-steps {
      padding: 0;
      background-color: #fff;
    }
  }
  .upload-drawer-header-tools {
    text-align: right;
    width: 330px;
    padding-right: 20px;
  }
}
.upload-drawer-body {
  background-color: #fff;
  height: calc(100vh - 52px);
}
</style>
  <style lang="scss">
.rk-upload-drawer {
  .el-drawer__body {
    padding: 0;
  }
}
</style>